<div ng-include="'dashboard/header.html'"></div>

<div ng-if="chartSnapshotsConfig && !charts.length">
	Your Dashboard is empty. Visit the <a href="#/trends" style="text-decoration: underline">Trends</a> page to add charts to the Dashboard for quick monitoring.
</div>

<div class="container-fluid">
	<div class="row" ng-repeat="chartSet in charts">
		<div class="col-md-{{ 12 / chartSnapshotsConfig.chartsPerRow }}" ng-repeat="chart in chartSet">
			<div style="height: 250px; border: 1px solid #CCC; padding: 5px">
				<div style="font-weight: bold">
					<a href="#/trend/{{ chart.report }}/{{ chart.value }}">{{ chart.report }}: {{ chart.value }}</a>
				</div>
				<ng-switch on="chart.isNumeric">
					<dashboard-chart ng-switch-when="true" report="{{ chart.report }}" valueName="{{ chart.value }}" chart-snapshots-config="chartSnapshotsConfig"></dashboard-chart>
					<color-band ng-switch-when="false" chart-snapshots-config="chartSnapshotsConfig" report="{{ chart.report }}" valueName="{{ chart.value }}"></color-band>
				</ng-switch>
			</div>
		</div>
	</div>
</div>